<template>
    <div class="BusinessPartner" style="width:100%">
        <Table :columns="tableHead" :data="tableBody">
            <template slot-scope="{ row }" slot="partner">
                <a @click="openModal">{{ row.partner }}</a>
            </template>
        </Table>
        <Modal title="业务合作伙伴详情" v-model="isModalOpen" :mask-closable="false" :width="950" :styles="{top: '30px'}">
            <BusinessPartnerDetial :contractNo="contractNo" :formData="formData" :dataDict="dataDict"/>
            <div slot="footer"></div>
        </Modal>
    </div>
</template>
<script>
    import BusinessPartnerDetial from "./BusinessPartnerDetial";
    import {getTitleFromDataDict} from "_p/basic/assets/contract/js/utils";
    import {channelInfo} from "_p/basic/api/contract/contract-detail-inquiry";

    export default {
        // 业务合作伙伴
        name: "BusinessPartner",
        components: {BusinessPartnerDetial},
        props: {
            contractNo: {
                type: String,
                required: true
            },
            dataDict: {
                type: Object,
                required: true
            }
        },
        data() {
            return {
                isModalOpen: false,
                formData: {
                    channelAddress: []
                },
                //   渠道类型(channelType)
                dicttArr: ["channelType"],
                baseData: {},
                tableHead: [
                    {
                        title: "业务合作伙伴",
                        key: "partner",
                        minWidth: 300,
                        slot: "partner"
                    },
                    {
                        title: "角色",
                        key: "role"
                    }
                ],
                tableBody: []
            };
        },
        mounted() {
        },
        watch: {
            baseData: {
                handler(val) {
                    this.updateTableBody();
                },
                deep: true
            },
            dataDict: {
                handler(val) {
                    this.updateTableBody();
                },
                deep: true
            }
        },
        methods: {
            init() {
            },
            updateData(data) {
                // console.log("updateData", data);
                if (!data) return;
                this.baseData = data;
            },

            updateTableBody() {
                this.tableBody = [
                    {
                        role: getTitleFromDataDict(
                            this.dataDict.channelTypeDict,
                            this.baseData.channelType
                        ),
                        partner: this.baseData.channelName
                    }
                ];
            },
            getDetial() {
                channelInfo(this.contractNo).then(res => {
                    console.log(res, "===");
                    if (res.code === "0000") {
                        this.formData = res.data;
                        this.formData.channelAddress = [res.data.channelAdminProvince, res.data.channelAdminCity]
                    }
                });
            },
            openModal() {
                this.isModalOpen = true;
                this.getDetial(this.contractNo);
            }
        }
    };
</script>
